<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=640" />
		<link rel="stylesheet" type="text/css" href="../css/reset.css" />
		<link rel="stylesheet" type="text/css" href="../font/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="../css/location.css" />
		<link rel="stylesheet" type="text/css" href="../css/animate.css" />
		<title></title>
	</head>

	<body>
		<div class="web">
			<div class="top">
				<span class="iconfont icon-jiazai"></span>
				<span>海南</span>
			</div>
			<div class="map">
				<img src="../images/hn.png"/>
				<div class="icon1">已领取<em>10</em>份</div>
				<div class="icon2">已领取<em>23</em>份</div>
			</div>
			<div class="map1">
				<img src="../images/gd.png"/>
				<div class="icon1">已领取<em>10</em>份</div>
				<div class="icon2">已领取<em>23</em>份</div>
				<div class="icon3">已领取<em>56</em>份</div>
			</div>
			<div class="content">
				<p class="one">剩余<em>9998</em>套</p>
				<p class="two">婚宴定制囍酒套装</p>
				<p class="three">待领取</p>
			</div>
			<div class="bottom">
				<div class="text">
					<p class="big">领取方式：</p>
					<p class="small">符合领取条件的用户凭结婚证以及酒店婚宴预定单据，前往张裕白兰地线下兑换点(限广东省、海南省区域)可获赠婚宴定制囍酒套装一份，共9999份，数量有限，领完为止。</p>
					<p class="big">领取时间：</p>
					<p class="small">2017年9月9日-10月29日</p>
					<p class="big">领取条件：</p>
					<p class="small">于2017年1月1日后进行婚姻登记，并在2017年9月9日-10月29日举办婚礼的新人(限广东省、海南省区域)</p>
				</div>
			</div>
			<a href="api.html" class="img"><img src="../images/location_03.jpg" /></a>

			<div class="return">
				<a class="iconfont icon-fangzi" href="index.html"></a>
			</div>
		</div>
		<script type="text/javascript">
			var span=document.querySelectorAll('span');
			var maps=document.getElementsByClassName('map')[0];
			var map1=document.getElementsByClassName('map1')[0];
			var content=document.getElementsByClassName('content')[0];
			span[0].addEventListener('click',function(){
				if(span[1].innerHTML=='海南'){
					span[1].innerHTML='广东'
					maps.style.display='block';
					map1.style.display='none';
					content.style.marginTop='-40px';
				}else{
					span[1].innerHTML='海南';
					maps.style.display='none';
					map1.style.display='block';
					content.style.marginTop='-142px';
				}
			})
		</script>
	</body>

</html>